<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>聚衣商城</title>
    <link rel="stylesheet" href="../../lib/css/reset.min.css">
    <link rel="stylesheet" href="../../css/all.min.css">
</head>

<body>
    <div class="app-wrap" v-cloak id="message">
        <header-top></header-top>
        <div class="bg_red">
            <div class="container">
                <a href="#"></a>
                <div class="header_main">
                    <span class="me">我的聚衣</span>
                    <span class="back">返回聚衣首页</span>
                </div>
                <ul class="list clear">
                    <li>首页</li>
                    <li>账户管理<i class="icon-down_1"></i></li>
                    <li>消息</li>
                </ul>
                <div class="input_group">
                    <input type="text" placeholder="搜索 商品">
                    <button>搜索</button>
                </div>
            </div>
        </div>
        <div class="settings-warp  bg-f2f2f2">
            <div class="container pt-20 bg-f2f2f2 clear">
                <!-- 左侧控制台 -->
                <div class="panel fl">
                    <dl class="section">
                        <dt><em class="icon-panel-setting"></em>消息中心</dt>
                        <dd><a href="javascript:;" @click="switchPages(0)" :class="{cur:pageType==0}">系统通知</a></dd>
                        <dd><a href="javascript:;" @click="switchPages(1)" :class="{cur:pageType==1}">交易助手</a></dd>
                    </dl>
                </div>
                <!-- 右侧主体 -->
                <div class="main fr">
                    <!-- 头部导航 -->

                    <div class="tabNav">
                        <span :class="{cur:pageType==0}" @click="switchPages(0)">系统通知</span>|
                        <span :class="{cur:pageType==1}" @click="switchPages(1)">交易助手</span>
                    </div>
                    <!-- 系统通知 -->
                    <div class="sysMsg-wrap">
                        <div class="item">
                            <div class="hd">
                                <b class="msgDot"></b>
                                <span class="txt">您的售后申请已处理，请查看详情</span>
                            </div>
                            <div class="bd">
                                <div class="img">
                                    <img src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2765628747,1700554554&fm=27&gp=0.jpg" alt="">
                                </div>
                                <p class="msg">退款/退货/补货编号：1213456789</p>
                                <span class="time">2016.9.21  08:50:08</span>
                                <span class="btn">查看</span>
                            </div>
                        </div>
                        <div class="item">
                            <div class="hd">
                                <b class="msgDot"></b>
                                <span class="txt">您的售后申请已处理，请查看详情</span>
                            </div>
                            <div class="bd">

                                <p class="msg">退款/退货/补货编号：1213456789</p>
                                <span class="time">2016.9.21  08:50:08</span>
                                <span class="btn">查看</span>
                            </div>
                        </div>
                        <common-page style="padding-top:20px;padding-bottom:20px;" :current="1" :all="100"></common-page>
                    </div>


                </div>
            </div>

        </div>
        <!-- 页脚 -->
        <com-footer></com-footer>
    </div>
    <script src="../../lib/js/vue.js"></script>
    <script src="../../lib/js/axios.min.js"></script>
    <!-- mock 数据 打包发布的时候记得移除 -->
    <script src="../../lib/js/mock.js"></script>
    <script src="../../js/all.min.js"></script>
    <script>
        message();
    </script>
</body>

</html>